<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <f:view contentType="text/html">
        <h:head>
            <f:facet name="first">
                <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                <title>.::ATUS::. Atención al Usuario</title>
                <link rel="shortcut icon" href="favicon.ico"/>
            </f:facet>
        </h:head>
        <h:body>
            <div>
                <h:graphicImage url="/atus/images/Banner.jpg" width="100%" height="100%" alt="LogoAtus"  style="vertical-align: top;"/> 
            </div>

            <p:panel>
                <p:panelGrid> 
                    <p:row>
                        <p:column style="vertical-align: top;"> 
                            <h:form>
                                <p:menu>
                                    <p:submenu label="Menú">                                
                                        <p:menuitem value="Inicio" url="/faces/atus/indexDependencia.xhtml" />
                                        <p:menuitem value="Turnos" url="/faces/atus/atencionTurnosDepen.xhtml" />
                                        <p:menuitem value="Reportes" url="/faces/atus/gestionReportesDepen.xhtml" />
                                        <p:menuitem value="Funcionario" url="/faces/atus/gestionFuncionarioDepen.xhtml" />
                                        <p:menuitem value="Cambio Contraseña" url="/faces/atus/CambiaPasswordDepen.xhtml" />
                                        <p:menuitem value="Cerrar Sesión" actionListener="#{usuariosAtusVista.cerrarSesion_action}" />
                                    </p:submenu>                    
                                </p:menu>
                            </h:form>
                        </p:column>
                        <p:column> 
                            <h:form id="formulario"> 
                                <p:panel id="panel" header="Turnos">
                                    <f:facet name="actions">
                                        <p:commandLink onclick="PF('helpDialog').show();" styleClass="ui-panel-titlebar-icon ui-corner-all ui-state-default"><h:outputText styleClass="ui-icon ui-icon-help" /></p:commandLink>
                                    </f:facet>
                                    <p:focus context="listaTurnos"/>
                                    <p:messages id="mensajes" showDetail="true" closable="true" />                            
                                    <h:outputText value="Seleccione el Turno de la Tabla para ver el Detalle" />
                                    <br />
                                    <p:dataTable id="listaTurnos" var="turnos" value="#{atencionTurnosVista.listaTurnos}"
                                                 paginator="true" rows="10" selection="#{atencionTurnosVista.selectedTurno}"
                                                 selectionMode="single" rowKey="#{turnos.codigo}"
                                                 emptyMessage="No Existen Turnos Hoy!" >

                                        <p:ajax event="rowSelect" listener="#{atencionTurnosVista.onRowSelect}"   
                                                update=":formulario:panelTurnos" /> 

                                        <f:facet name="header">  
                                            Turnos Fecha: #{atencionTurnosVista.fechaSistema} Area: #{atencionTurnosVista.txtArea} 
                                        </f:facet> 

                                        <p:column sortBy="#{turnos.numero}" filterBy="#{turnos.numero}" filterMatchMode="contains">
                                            <f:facet name="header">
                                                <h:outputText  value="N° Turno" />                            
                                            </f:facet>
                                            <h:outputText  value="#{turnos.numero}" />                          
                                        </p:column>

                                        <p:column sortBy="#{turnos.documentoCliente.documento.documento}" filterBy="#{turnos.documentoCliente.documento.documento}" filterMatchMode="contains">
                                            <f:facet name="header">
                                                <h:outputText  value="Documento Cliente" />                            
                                            </f:facet>
                                            <h:outputText  value="#{turnos.documentoCliente.documento.documento}" />                          
                                        </p:column>
                                        <p:column sortBy="#{turnos.documentoCliente.documento.nombre}" filterBy="#{turnos.documentoCliente.documento.nombre}" filterMatchMode="contains">
                                            <f:facet name="header">
                                                <h:outputText  value="Cliente" />                            
                                            </f:facet>
                                            <h:outputText  value="#{turnos.documentoCliente.documento.nombre} #{turnos.documentoCliente.documento.apellido}" />                          
                                        </p:column>

                                        <p:column>
                                            <f:facet name="header">
                                                <h:outputText  value="Hora Ingreso" />                            
                                            </f:facet>
                                            <h:outputText  value="#{turnos.horaIngreso}" />                          
                                        </p:column> 

                                        <p:column>
                                            <f:facet name="header">
                                                <h:outputText  value="Hora Salida" />                            
                                            </f:facet>
                                            <h:outputText  value="#{turnos.horaSalida}" />                          
                                        </p:column> 

                                        <p:column sortBy="#{turnos.estado}">
                                            <f:facet name="header">
                                                <h:outputText  value="Estado" />                            
                                            </f:facet>
                                            <h:outputText  value="#{turnos.estado}" />                          
                                        </p:column>
                                    </p:dataTable>                            
                                    <br />

                                    <p:panel id="panelTurnos" header="Turno">
                                        <p:panelGrid>
                                            <p:row>
                                                <p:column>
                                                    <h:outputText value="N° Turno:"/> 
                                                </p:column>
                                                <p:column>
                                                    <p:inputText id="txtTurno" binding="#{atencionTurnosVista.txtTurno}" size="30" disabled="true" />                                            
                                                </p:column>

                                                <p:column>
                                                    <h:outputText value="Documento Usuario:"/> 
                                                </p:column>
                                                <p:column colspan="2">
                                                    <p:inputText id="txtDocumento" binding="#{atencionTurnosVista.txtIdentificacion}" size="30" disabled="true" />
                                                </p:column>
                                            </p:row> 
                                            <p:row>
                                                <p:column>
                                                    <h:outputText value="Nombre:"/> 
                                                </p:column>
                                                <p:column>
                                                    <p:inputText id="txtNombre" binding="#{atencionTurnosVista.txtNombre}" size="30" disabled="true"/> 
                                                </p:column> 
                                                <p:column>
                                                    <h:outputText value="Apellido:"/> 
                                                </p:column>
                                                <p:column>
                                                    <p:inputText id="txtApellido" binding="#{atencionTurnosVista.txtApellido}" size="30" disabled="true"/> 
                                                </p:column>
                                            </p:row>
                                            <p:row>
                                                <p:column>
                                                    <h:outputText value="Correo:"/> 
                                                </p:column>
                                                <p:column>
                                                    <p:inputText id="txtCorreo" binding="#{atencionTurnosVista.txtCorreo}" size="30" disabled="true"/> 
                                                </p:column> 
                                                <p:column>
                                                    <h:outputText value="Teléfono:"/> 
                                                </p:column>
                                                <p:column>
                                                    <p:inputText id="txtTelefono" binding="#{atencionTurnosVista.txtTelefono}" size="30" disabled="true"/> 
                                                </p:column>
                                            </p:row> 
                                            <p:row>
                                                <p:column>
                                                    <h:outputText value="Motivo:"/> 
                                                </p:column>
                                                <p:column colspan="3">
                                                    <p:inputTextarea id="txtMotivo" binding="#{atencionTurnosVista.txtMotivo}" rows="3" cols="45" autoResize="false" disabled="true"></p:inputTextarea>
                                                </p:column>                                         
                                            </p:row>
                                            <p:row>
                                                <p:column>
                                                    <h:outputText value="Hora Ingreso:"/> 
                                                </p:column>
                                                <p:column>
                                                    <p:inputText id="txtHoraIngreso" binding="#{atencionTurnosVista.txtHoraIngreso}" disabled="true"  size="30"/>
                                                </p:column> 
                                                <p:column>
                                                    <h:outputText value="Hora Salida:"/> 
                                                </p:column>
                                                <p:column>
                                                    <p:inputText id="txtHoraSalida" binding="#{atencionTurnosVista.txtHoraSalida}" value="#{turnosVista.horaSistema}" disabled="true" size="30"/>
                                                </p:column> 
                                            </p:row>
                                            <p:row>
                                                <p:column>
                                                    <h:outputText value="Observaciones:"/> 
                                                </p:column>
                                                <p:column colspan="3">
                                                    <p:inputTextarea id="txtObservaciones" binding="#{atencionTurnosVista.txtObservaciones}" rows="3" cols="45" autoResize="false"></p:inputTextarea>
                                                </p:column>                                        
                                            </p:row>
                                            <p:row>
                                                <p:column>
                                                    <h:outputText value="Estado:"/> 
                                                </p:column>
                                                <p:column colspan="3">                                            
                                                    <p:inputText id="txtEstado" binding="#{atencionTurnosVista.txtEstado}" disabled="true" size="30" style="font-weight: bold;"/> 
                                                </p:column>                                           
                                            </p:row>

                                            <p:row>
                                                <p:column colspan="4">
                                                    <div align="center"> 
                                                        <p:commandButton id="btnAceptar" value="Aceptar" binding="#{atencionTurnosVista.btnAceptar}" action="#{atencionTurnosVista.actualizarTurno_action}" disabled="true"  update="formulario" />
                                                        <p:commandButton id="btnLimpiar" value="Limpiar" binding="#{atencionTurnosVista.btnLimpiar}" action="#{atencionTurnosVista.limpiar_action}"  update="formulario" />
                                                    </div>
                                                </p:column>  
                                            </p:row>

                                        </p:panelGrid>

                                    </p:panel>                    

                                </p:panel>
                                <!-- dialogo de ayuda -->
                                <p:dialog id="modalDialog" header="Ayuda" widgetVar="helpDialog" showEffect="fade" hideEffect="explode" modal="true" dynamic="true">  
                                    <p align="justify">                       
                                        En esta página usted podrá:<br/><br/>
                                        <b>-Consultar Turnos del Día:</b>
                                        Cuando inicia esta página aparece una tabla con todos los turnos asignado a su área en el día. Aquí podrá consultar y filtrar los turnos por su estado, número o cédula del cliente.
                                        <br/><br/>
                                        <b>-Atender Turnos:</b>
                                        Para atender un turno asignado a usted simplemente debe seleccionarlo de la tabla de consulta. Luego sus datos se cargarán en el formulario y allí podrá registrar observaciones si
                                        es el caso y luego darle clic en Aceptar para finalizarlo.
                                        <br/><br/>
                                        <u>Nota:</u> Solo se pueden consultar y atender los turnos del día en curso. Si un turno no es atendido y queda pendiente por algún motivo, el sistema al día siguiente lo actualizará
                                        como Cerrado.
                                    </p>
                                </p:dialog>
                            </h:form>
                        </p:column>
                    </p:row>
                </p:panelGrid>
            </p:panel> 
            <div>
                <h:graphicImage url="/atus/images/Pie.jpg" width="100%" height="100%" alt="LogoAtus"  style="vertical-align: bottom;"/>
            </div>
        </h:body>

    </f:view>
</html>
